<template>
  <div class="px-[5px] pt-[10px] text-right" v-if="props.showCheckText && procInsId">
    <el-link type="primary" @click="checkHistoryModalVisible = true">审核记录</el-link>
  </div>
  <!-- 基本信息 -->
  <div class="bg-white my-[10px]">
    <BaseHead style="border-bottom: 0">基本信息</BaseHead>
    <BaseTable>
      <tr>
        <td class="td-name">申请人</td>
        <td>{{ detailData.applyer }}</td>
        <td class="td-name">申请时间</td>
        <td>{{ formatDate(detailData.applyTime, "YYYY-MM-DD") }}</td>
      </tr>
      <tr>
        <td class="td-name">项目负责人</td>
        <td>{{ detailData.chargerName }}</td>
        <td class="td-name">项目名称</td>
        <td>{{ detailData.name }}</td>
      </tr>
      <tr>
        <td class="td-name">联系电话</td>
        <td>{{ detailData.contactPhone }}</td>
        <td class="td-name">所属单位</td>
        <td>
          <CommonTreeLabel
            isFetch
            paramsName="所有单位"
            valueKey="codeColumn"
            labelKey="valueColumn"
            :value="detailData.unitId"
          />
        </td>
      </tr>
    </BaseTable>
  </div>
  <!-- 作者信息 -->
  <div class="bg-white my-[10px]">
    <BaseHead style="border-bottom: 0">其他信息</BaseHead>
    <BaseTable>
      <tr>
        <td class="td-name">实验要点</td>
        <td style="width: 87.5%">{{ detailData.experimentKey }}</td>
      </tr>
      <tr>
        <td class="td-name">审查依据</td>
        <td>{{ detailData.reviewBasis }}</td>
      </tr>
      <tr>
        <td class="td-name">审查材料</td>
        <td>
          <template v-if="detailData.fileInfoList">
            <p v-for="item in detailData.fileInfoList" :key="item.id" class="my-[5px]">
              {{ item.filename
              }}<el-link
                type="primary"
                @click="handleDownload(item.fileId, item.filename)"
                class="ml-[5px]"
                >下载</el-link
              >
            </p>
          </template>
        </td>
      </tr>
    </BaseTable>
  </div>
  <CheckHistoryModal
    v-model="checkHistoryModalVisible"
    :procInsId="procInsId"
    :checker="checker"
    :checkDate="checkDate"
  />
</template>

<script setup>
import CheckHistoryModal from "@/views/project/components/CheckHistoryModal.vue";
import BaseHead from "@/views/project/components/BaseHead.vue";
import BaseTable from "@/views/project/components/BaseTable.vue";
import CommonTreeLabel from "@/views/project/components/CommonTreeLabel.vue";
import { recordsDetail } from "@/api/llsc";
import { handleDownload } from "@/utils/main";
import { formatDate } from "@/utils/formatTime";
const props = defineProps({
  operateId: String,
  showCheckText: {
    type: Boolean,
    default: false, //默认不显示审核记录文字
  },
});
const checkHistoryModalVisible = ref(false);
const detailData = ref({});
const procInsId = ref(null); //流程实例id
const checker = ref("");
const checkDate = ref("");
//获取记录详情
const getDetail = async () => {
  try {
    const res = await recordsDetail(props.operateId);
    detailData.value = res.data;
    procInsId.value = res.data.processInstanceId;
    checker.value = res.data.checker;
    checkDate.value = res.data.checkdate;
  } catch (error) {
    console.log(error);
  }
};
onMounted(() => {
  getDetail();
});
</script>

<style scoped lang="scss"></style>
